<aside class="control-sidebar control-sidebar-light" style="height: 100%;">
  <!-- Create the tabs -->
  <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
    <li class=""><a href="#">筛选</a></li>
    <li class=""><a href="#" data-toggle="control-sidebar"><i class="glyphicon glyphicon-remove"></i></a></li>
  </ul>
  <!-- Tab panes -->
  <div class="tab-content">
    <form action="<{url action=topshop_ctl_trade_list@search}>" method="post" role="form" data-validate-onsuccess="ajaxSuccess">
      <input type="hidden" value="<{$filter.status}>" id="filter_status">
      <input type="hidden" value="<{$filter.settlement_status}>" id="filter_settlement_status">
      <div class="box-body">
        <!-- Date range -->
        <div class="form-group">
          <label>下单时间:</label>

          <div class="input-group">
            <div class="input-group-addon">
              <i class="fa fa-calendar"></i>
            </div>
            <input type="text" name="create_time" class="form-control pull-right reservation">
          </div>
          <!-- /.input group -->
        </div>
        <!-- /.form group -->

        <!-- text input -->
        <div class="form-group">
          <label>订单号：</label>
          <input type="text" name="tid" class="form-control" placeholder="请输入 ...">
        </div>

        <!-- select -->
        <div name="status" class="form-group">
          <label>订单状态</label>
          <select name="status" class="form-control select-reset">
            <{foreach from=$status item=value key=key}>
            <option value="<{$key|escape:"html"}>"><{$value|escape:"html"}></option>
            <{/foreach}>
          </select>
        </div>

        <!-- text input -->
        <div class="form-group">
          <label>会员帐号：</label>
          <input type="text" name="user_name" class="form-control" placeholder="请输入 ...">
        </div>
        <div class="form-group">
          <label>收货人：</label>
          <input type="text" name="receiver_name" class="form-control" placeholder="请输入 ...">
        </div>
        <div class="form-group">
          <label>收货人手机：</label>
          <input type="text" name="receiver_mobile" class="form-control" placeholder="请输入 ...">
        </div>
        <!--  <div class="form-group">
          <label>收货人电话：</label>
          <input type="text" name="receiver_phone" class="form-control" placeholder="请输入 ...">
        </div> -->

        <!-- select -->
        <div class="form-group">
          <label>结算状态</label>
          <select name="settlement_status" class="form-control select-reset">
            <{foreach from=$settlement_status item=value key=key}>
            <option value="<{$key|escape:"html"}>"><{$value|escape:"html"}></option>
            <{/foreach}>
          </select>
        </div>
      </div>
      <!-- /.box-body -->
      <div class="box-footer">
        <button type="button" class="btn btn-default" id="reset-form">重置</button>
        <button type="submit" class="btn btn-info pull-right">搜索</button>
      </div>
      <!-- /.box-footer -->
    </form>
  </div>
</aside>

<div class="nav-tabs-custom" id="tabs">
  <ul class="nav nav-tabs">
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_0" data-toggle="tab">全部</a></li>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_1" data-toggle="tab">待支付</a></li>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_2" data-toggle="tab">待发货</a></li>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_3" data-toggle="tab">待收货</a></li>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_4" data-toggle="tab">已收货</a></li>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_5" data-toggle="tab">已取消</a></li>
    <{if $shop_type == "self"}>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_6" data-toggle="tab">货到付款</a></li>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_7" data-toggle="tab">自提订单</a></li>
    <li><a href="<{url action=topshop_ctl_trade_list@search}>#tab_8" data-toggle="tab">送货上门</a></li>
    <{/if}>
    <li class="pull-right header export-filter" data-value="" data-app="" data-model="">
      <div class="btn-group">
        <a href="<{url action=topshop_ctl_export@export app=systrade model=trade orderBy=tid}>" data-model="trade" data-app="systrade" class="btn btn-box-tool btn-export" data-widget="more" data-toggle="tooltip" title="" data-original-title="订单导出">
          <i class="glyphicon glyphicon-open"></i>
        </a>
        <a href="<{url action=topshop_ctl_export@export app=systrade model=order orderBy=tid}>" data-model="order" data-app="systrade" class="btn btn-box-tool btn-export" data-widget="more" data-toggle="tooltip" title="" data-original-title="子订单导出">
          <i class="glyphicon glyphicon-export"></i>
        </a>
        <button data-toggle="control-sidebar" class="btn btn-box-tool">
          <i class="glyphicon glyphicon-search text-light-blue"></i>
        </button>
      </div>
      <!-- /.btn-group -->
    </li>
  </ul>
  <div class="tab-content no-padding">
    <div class="tab-pane" id="tab_0">
    </div><!-- /.tab-pane -->
    <div class="tab-pane" id="tab_1">

    </div><!-- /.tab-pane -->
    <div class="tab-pane" id="tab_2">

    </div><!-- /.tab-pane -->
    <div class="tab-pane" id="tab_3">

    </div><!-- /.tab-pane -->
    <div class="tab-pane" id="tab_4">

    </div><!-- /.tab-pane -->
    <div class="tab-pane s" id="tab_5">

    </div><!-- /.tab-pane -->
    <{if $shop_type == "self"}>
    <div class="tab-pane" id="tab_6">

    </div><!-- /.tab-pane -->
    <div class="tab-pane" id="tab_7">

    </div><!-- /.tab-pane -->
    <div class="tab-pane" id="tab_8">

    </div><!-- /.tab-pane -->
    <{/if}>
  </div>
  <!-- /.tab-content -->
</div>
<!-- /.nav-tabs-custom -->

<!--订单取消弹框-->
<div class="modal fade" id="orderCancel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">

    </div>
  </div>
</div>
<!--订单修改弹框-->
<div class="modal fade" id="orderEdit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">

    </div>
  </div>
</div>
<!--特殊情况订单取消弹框-->
<div class="modal fade" id="orderCancelSpecial">
  <div class="modal-dialog">
    <div class="modal-content">

    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!--订单收款并完成 -->
<div class="modal fade" id="orderFinish" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">

    </div>
  </div>
</div>

<div class="modal fade" id="delivery" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
    </div>
  </div>
</div>

<!--订单拒收弹框-->
<div class="modal fade" id="orderRejection" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog order-rejection">
    <div class="modal-content">
    </div>
  </div>
</div>

<!--发送自提提货码弹出框-->
<div class="modal fade" id="sendDeliverySms" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog send-delivery-sms">
    <div class="modal-content">
    </div>
  </div>
</div>

<!--验证自提提货码弹出框-->
<div class="modal fade" id="checkDeliveryVcode" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog check-delivery-vcode">
    <div class="modal-content">
    </div>
  </div>
</div>

<script>
  $('.reservation').daterangepicker({
    format: 'YYYY/MM/DD',
    opens: 'right'
  });
  $('.reservation').val('');

  $('#tabs a[data-toggle="tab"]').on('show.bs.tab', function (e) {
    var tabhref = $(this).attr('href');
    var tab = tabhref.split("#")[1];
    var status = tab.split("_")[1];
    var useSessionFilter = '<{$useSessionFilter}>';

    //交易搜索后 保留搜索条件
    if(useSessionFilter){
      var username =  $("form input[name=user_name]").val();
      var createtime =  $("form input[name=create_time]").val();
      var tid =  $("form input[name=tid]").val();
      var receiver_name =  $("form input[name=receiver_name]").val();
      var receiver_mobile =  $("form input[name=receiver_mobile]").val();
      var settlement_status =  $("form input[name=settlement_status]").val();
      var receiver_phone =  $("form input[name=receiver_phone]").val();

      $('#'+tab).load(tabhref,{'status':status,'user_name':username,'create_time':createtime,'receiver_name':receiver_name,'receiver_mobile':receiver_mobile,'settlement_status':settlement_status,'receiver_phone':receiver_phone,'tid':tid });
    }else{
      $('#'+tab).load(tabhref,{'status':status});
    }
    //$("form input[name=status]").val($(this).text());
    $("form select[name=status]").val(status);
  }).eq($('#filter_status').val()).trigger('click');

  function ajaxSuccess(e) {
    var form = e.target;
    $(form).find('button[type=submit]').prop('disabled', false);
    e.preventDefault();
    $.post(form.action, $(form).serialize(),function(rs){
      var status = $(form).find('select[name=status]').val();
      //$('#tabs a[data-toggle="tab"]').eq(status).trigger('click');
      $('#tabs a[data-toggle="tab"]').eq(status).parent().addClass('active').siblings().removeClass('active');

      $('#tabs .tab-pane.active').html(rs);

      $('.control-sidebar').removeClass('control-sidebar-open');
      $('body').removeClass('control-sidebar-open');
    });
  }

  $('#orderCancel,#orderEdit,#delivery,#orderFinish').on('hide.bs.modal', function (e) {
    $(this).removeData('bs.modal');
  })

  $('.btn-export').click(function (e) {
    e.preventDefault();
    var url = $(this).attr('href');
    var app = $(this).data('app');
    var model = $(this).data('model');
    var listArr = []
    var filter = null
    var list = $('.data-list tbody tr')
    for (var i = 0; i < list.length; i++) {
      var checked = $(list[i]).find('input[type="checkbox"]');
      if($(checked).prop('checked')==true){
        var listId = $(checked).val();
        listArr.push(listId);
      }
    };

    if( listArr.length > 0 ){
      filter = '{"tid":[' + listArr + ']}';
      $('.export-filter').attr('data-app',app);
      $('.export-filter').attr('data-model',model);
      $('.export-filter').attr('data-value',filter);
      $('#exportDialog').modal({remote: url}).attr('data-app',app).attr('data-model',model);
    }else{
      Modal.confirm({msg: '是否确认导出全部？'}).on(function(e) {
        if(e==true) {
          $('.export-filter').attr('data-app',app);
          $('.export-filter').attr('data-model',model);
          $('#exportDialog').modal({remote: url}).attr('data-app',app).attr('data-model',model);
        }
      });
    }
  })

  $(document).ready(
    function() {
      $(".sidebar .sidebar-menu li a i.glyphicon").eq(1).removeClass("glyphicon-list-alt").addClass("glyphicon-stats");
    }
  );

  // 重置表单
  $('input[name="create_time"]').val('');
  $('#reset-form').on('click',function(){
    $('input:visible').val('');
    $('.select-reset').val(-1);
  });
</script>
